import { PageContainer } from '@ant-design/pro-layout';
import ProTable from '@ant-design/pro-table';
import ProForm, { DrawerForm, ProFormText, ProFormSelect, ProFormDigit, ProFormDateRangePicker } from '@ant-design/pro-form';
import React, { useState, useRef } from 'react';
import type { ProColumns, ActionType } from '@ant-design/pro-table';
import { lineList,saveline,updateline,deleteline } from '../service';
import { manufacturerOptionArray ,manufacturerOptionOnly} from '@/utils/utils';

import { Popconfirm,Button,message, Space, Table, Modal, Form } from 'antd';
export default () => {
const [showCreate, setShowCreate] = useState(false);
const [dChoose,setDChoose] = useState(false);
const actionRef = useRef<ActionType>();
const [detail, setDetail] = useState<any>({});
const [dData,setDData]= useState<any>([{'id':'0'},{'id':'1'},{'id':'2'}]);
const [dataList,setDataList] = useState<any>([{'id':'0',name:'多孔腔镜手术机器人'},{'name':'单孔腔镜手术机器人',id:'2'}]);
const dColumns:ProColumns[] = [
  {
    title:'客户代码',
    dataIndex:'code',
    width:200,
    renderText:()=>'JXS0534'
  },
  {
    title:'客户名称',
    dataIndex:'name',
    width:150,
    renderText:()=>'合肥**医疗器械有限公司'
  },
]
const columns: ProColumns[] = [
  

   {
       title:'产品名称',
       dataIndex:'name',
       ellipsis:true,
   },
   {
    title:'注册证信息',
    dataIndex:'registration',
    width:200,
    ellipsis:true,
    renderText:()=>'国械注准20193031066'
  },
  {
    title:'创建日期',
    dataIndex:'createTime',
    width:200,
    ellipsis:true,
    hideInSearch:true,
    renderText:()=>'2023-01-01'
  },
 
   {
    title:'操作',
    width:120,
    valueType:'option',
    fixed: 'right',
    render: (text, record:any, _, action) => [
       <a key='detail' onClick={async () => {
       setDetail(record)
         setShowCreate(true)
       }}>详情</a>,
       <Popconfirm title='确定要删除吗?' key='delete' onConfirm={() => handleDelete(record.id)}><a>删除</a></Popconfirm>
      
    ]}
   ]
   const handleDelete = async(id:string) => {
      //   var val = await deleteline({
      //     id: id,
      //   });

      //  if (val.errorCode === '200') {
      //      message.success('删除成功')
      //      actionRef.current?.reloadAndRest?.()
      //  } else {
      //     message.error(val.errorMessage)
      //  }
   };
return (<PageContainer>
    <ProTable actionRef={actionRef} headerTitle='列表' pagination={{pageSizeOptions: ['20', '100', '500']}}
      // tableAlertOptionRender={({selectedRowKeys,onCleanSelected}) => {
      //   return (
      //     <Space size={16}>
      //       <a key="i2" style={{ marginLeft: 8 }} onClick={onCleanSelected}>
      //         取消选择
      //       </a>
      //       <a key="i1" onClick={()=>{
      //         setDChoose(true)
      //       }}>授权</a>
      //       <a key="i0" onClick={()=>{
              
      //       }}>取消授权</a>
      //     </Space>
      //   );
      // }}
      // rowSelection={{
      //   selections: [Table.SELECTION_ALL, Table.SELECTION_INVERT],
      // }}
      // request={(params, sorter, filter) => lineList({ ...params,filter})}
      dataSource={dataList}
      columns={columns} rowKey='id' toolbar={{settings: []}}
       search={{labelWidth: 120}} toolBarRender={() => [<Button type='primary' key='primary' onClick={() => {setShowCreate(true);setDetail(undefined)}}>新增</Button>]}
   />
  <DrawerForm title={detail ? '编辑' : '新增'} onVisibleChange={setShowCreate} visible={showCreate} drawerProps={{forceRender: true,destroyOnClose: true}} 
  onFinish={async (values: any) => {
    var val = undefined
    if (detail) {
      values.id = detail.id;
      val = await updateline(values);
    } else {
      val = await saveline(values);
    }
    if (val.errorCode === '200') {
      message.success('提交成功');
      actionRef.current?.reloadAndRest?.();
      return true;
    } else {
      message.error(val.errorMessage);
      return false;
    }
  }}>
      
       <ProForm.Group>
           <ProFormText name='name' label='产品名称'  placeholder='请输入产品名称' width='md' initialValue={detail?.name} rules={[{required: true}]} />
       </ProForm.Group>
       <ProForm.Group>
           <ProFormText name='registration' label='注册证信息'  placeholder='请输入注册证信息' width='md' initialValue={detail?.registration} rules={[{required: true}]} />
       </ProForm.Group>
     
	  </DrawerForm>

    <Modal
        title="授权客户"
        destroyOnClose={true}
        width={1000}
        visible={dChoose}
        onOk={()=>{
           
        }}
        onCancel={()=>{
          setDChoose(false)
        }}
        >
        <ProTable
            scroll={{ y: 240 }}
            toolBarRender={false }
            columns={dColumns}
            dataSource = {dData}
            search={{span:6,
            }}
            tableAlertOptionRender={({selectedRowKeys,onCleanSelected}) => {
              return (
                <Space size={16}>
                  <a key="i2" style={{ marginLeft: 8 }} onClick={()=>{
                    onCleanSelected()
                  }}>
                    取消选择
                  </a>
                  <Form.Item style={{marginBottom:-25}}>
                    <ProFormSelect  label='授权类型' name='authType' options={[{label:'普通授权',value:'1'},{label:'招标授权',value:'1'}]}></ProFormSelect>
                  </Form.Item>
                  <Form.Item style={{marginBottom:-25}}>
                  <ProFormDateRangePicker label="授权期限" fieldProps={{onChange:(val:any)=>{
                      
                    }}}></ProFormDateRangePicker>
                  </Form.Item>
           
                </Space>
              );
            }}
            rowKey="id"
            pagination={{
              pageSizeOptions:['20', '100', '500']
            }}
            rowSelection={{
              selections: [Table.SELECTION_ALL, Table.SELECTION_INVERT],
            }}
            />
    </Modal>
   </PageContainer>
)}